/**
 * 消息页
 */
import React, { PureComponent } from 'react';
import {
  Image,
  StyleSheet,
  Text,
  View,
  TouchableOpacity,
  ScrollView,
} from 'react-native';
import { connect } from 'react-redux';
import ImagePicker from 'react-native-image-picker';
import CodePush from 'react-native-code-push';
import actions from '../../models/actions';
import NavigationBar from '../../components/navigationBar';
import image from '../../assets/image';
import {
  LoginToken,
  safeAreaBottomHeight,
  screenWidth,
} from '../../util/AdapterUtil';
import NavigationService from '../../components/NavigationService';
import AlertView from '../../components/AlertView';

class AccountSafeScreen extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {}

  render() {
    const isChildAccount = !!this.props.userInfo.uperUserId;
    return (
      <View style={{ flex: 1, backgroundColor: '#F9F9F9' }}>
        <NavigationBar
          navigation={this.props.navigation}
          isBack={true}
          title={'账号安全'}
        />
        <ScrollView
          showsVerticalScrollIndicator={false}
          style={{
            width: '100%',
            backgroundColor: '#F9F9F9',
          }}
        >
          <View style={{ height: 10, backgroundColor: '#F9F9F9' }} />

          <TouchableOpacity
            style={styles.itemStyle}
            onPress={() => {
              NavigationService.navigate('ResetPasswordbyOrg');
            }}
          >
            <Text
              style={{
                marginLeft: 15,
                color: '#606060',
                fontSize: 18,
              }}
            >
              登录密码
            </Text>
            <View style={{ flex: 1 }} />
            <Image
              style={{ width: 20, height: 20 }}
              source={image.ic_right_arrow}
            />
          </TouchableOpacity>
          <View style={styles.divider} />
          {!isChildAccount && (
            <TouchableOpacity
              style={styles.itemStyle}
              onPress={() => {
                if (!global.havaPayPassword) {
                  NavigationService.navigate('SetPayPassword', {
                    istohome: true,
                  });
                } else {
                  NavigationService.navigate('VerificationPayPassword', {
                    istohome: false,
                  });
                }
              }}
            >
              <Text
                style={{
                  marginLeft: 15,
                  color: '#606060',
                  fontSize: 18,
                }}
              >
                支付密码
              </Text>
              <View style={{ flex: 1 }} />
              <Image
                style={{ width: 20, height: 20 }}
                source={image.ic_right_arrow}
              />
            </TouchableOpacity>
          )}
        </ScrollView>
        <View style={{ height: safeAreaBottomHeight }} />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  itemStyle: {
    paddingLeft: 15,
    paddingRight: 15,
    height: 60,
    flexDirection: 'row',
    backgroundColor: '#fff',
    alignItems: 'center',
  },
  divider: {
    marginLeft: 70,
    height: 1,
    backgroundColor: '#F9F9F9',
    transform: [{ scaleY: 0.5 }],
  },
});

export default connect(
  ({ userInfo }) => ({
    userInfo,
  }),
  {},
)(AccountSafeScreen);
